﻿
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Upload</title>
    <link href="~/Content/bootstrap.min.css" rel="stylesheet">
    <link href="~/Content/bootsrtap-fileinput/css/fileinput.css" media="all" rel="stylesheet" type="text/css" />
    <link href="~/Content/font-awesome.min.css" media="all" rel="stylesheet" type="text/css" />
    <link href="~/Content/bootsrtap-fileinput/themes/explorer-fa/theme.css" media="all" rel="stylesheet" type="text/css" />
    <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script src="~/Scripts/bootsrtap-fileinput/js/plugins/sortable.js" type="text/javascript"></script>
    <script src="~/Scripts/bootsrtap-fileinput/js/fileinput.js" type="text/javascript"></script>
    <script src="~/Scripts/bootsrtap-fileinput/js/locales/fr.js" type="text/javascript"></script>
    <script src="~/Scripts/bootsrtap-fileinput/js/locales/es.js" type="text/javascript"></script>
    <script src="~/Content/bootsrtap-fileinput/themes/explorer-fa/theme.js" type="text/javascript"></script>
    <script src="~/Content/bootsrtap-fileinput/themes/fa/theme.js" type="text/javascript"></script>
    <script src="~/Scripts/bootstrap.min.js" type="text/javascript"></script>
    <script src="~/Scripts/bootsrtap-fileinput/js/locales/zh.js"></script>
</head>
<body>
    <div class="col-md-6">
        <input type="file" name="fileToUpload" id="fileToUpload">
    </div>
    <script type="text/javascript">
        //初始化fileinput控件（第一次初始化）
        function initFileInput(ctrlName, uploadUrl) {
            var control = $('#' + ctrlName);

            control.fileinput({
                language: 'zh', //设置语言
                uploadUrl: uploadUrl, //上传的地址
                allowedFileExtensions: ['jpg', 'png', 'gif'],//接收的文件后缀
                allowedFileTypes: ['image'],//文件选择过滤
                uploadAsync: true, //默认异步上传
                showRemove: true, //显示移除按钮
                showUpload: true, //是否显示上传按钮
                showPreview: true, //是否显示预览
                showCaption: false,//是否显示标题
                //minImageWidth: 50, //图片的最小宽度
                //minImageHeight: 50,//图片的最小高度
                //maxImageWidth: 1000,//图片的最大宽度
                //maxImageHeight: 1000,//图片的最大高度
                browseClass: "btn btn-primary", //按钮样式
                previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
            });
        }

        //初始化fileinput控件（第一次初始化）
        initFileInput("fileToUpload", "Home/Upload");
        //导入文件上传完成之后的事件
        $("#fileToUpload").on("fileuploaded", function (event, data, previewId, index) {
            alert(data.response.success);
        });
    </script>
</body>
</html>
